<!DOCTYPE html>
<style>
    body {
        -webkit-writing-mode: vertical-rl;
    }

    .rule {
        border-top-color: gray;
        border-top-width: 12px;
        width: 200px;
        height: 0;
        margin: 4px 0;
        display: inline-block;
    }
</style>

<div class="rule" style="border-top-style: solid;"></div>
<div class="rule" style="border-top-style: dotted;"></div>
<div class="rule" style="border-top-style: dashed;"></div>
<div class="rule" style="border-top-style: groove;"></div>
<div class="rule" style="border-top-style: ridge;"></div>
<div class="rule" style="border-top-style: inset;"></div>
<div class="rule" style="border-top-style: outset;"></div>
<div class="rule" style="border-top-style: double;"></div>